import { defineComponent, reactive, onMounted } from 'vue'
import Draw from './draw'
import {
	getTimeStamp,
	record,
	realtimeApi,
	temperatureApi,
	PHApi,
	indooreApi,
	humidityApi,
} from '../../../apis/exampleApi'
import request from '../../../utils/request'
import storage from '../../../utils/storage'
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'

export default defineComponent({
	components: {
		Draw,
	},

	setup() {
		onMounted(() => {
			// 气温
			temperatureApi({ index: useStore().state.index })
				.then((res: any) => {
					cdata.tmax = res.data.ymax
					cdata.dateData = res.data.x
					cdata.temperature = res.data.y
					console.log(res.data)
				})
				.catch((err: any) => {
					console.log(err)
				})

			// 室内温度
			indooreApi({ index: useStore().state.index })
				.then((res: any) => {
					cdata.indoorTemperature = res.data.y
				})
				.catch((err: any) => {
					console.log(err)
				})

			// PH
			PHApi({ index: useStore().state.index })
				.then((res: any) => {
					cdata.PHData = res.data.y
				})
				.catch((err: any) => {
					console.log(err)
				})

			// 湿度
			humidityApi({ index: useStore().state.index })
				.then((res: any) => {
					cdata.smax = res.data.ymax
					cdata.humidityData = res.data.y
				})
				.catch((err: any) => {
					console.log(err)
				})
		})
		const cdata = reactive({
			tmax: 98,
			smax: 40,
			dateData: [],
			temperature: [],
			indoorTemperature: [],
			PHData: [],
			humidityData: [],
		})

		return () => {
			return (
				<div>
					<Draw cdata={cdata} />
				</div>
			)
		}
	},
})
